<template>
  <div class="index">
    <app-header></app-header>
    
    <div class="content">
      <mt-tab-container  v-model="$store.state.selected">  
          <mt-tab-container-item id="首页">  
            <app-home></app-home>
          </mt-tab-container-item>   
          <mt-tab-container-item id="业务">  
            <app-tel></app-tel>
          </mt-tab-container-item>    
          <mt-tab-container-item id="生活">  
           <app-sport></app-sport>
          </mt-tab-container-item>   
          <mt-tab-container-item id="合作">  
            <app-friend></app-friend>
          </mt-tab-container-item>   
          <mt-tab-container-item id="关于">  
           <app-about></app-about>
          </mt-tab-container-item>    
      </mt-tab-container>  
      <div class="clear">
       
      </div>
    </div>
    

   <!-- <div class="footer">  
    <mt-tabbar fixed v-model="selected">
      <mt-tab-item id="首页">
        <img slot="icon" src="../../../static/images/home.png">首页
      </mt-tab-item>
      <mt-tab-item id="业务">
        <img slot="icon" src="../../../static/images/tel.png">业务
      </mt-tab-item>
      <mt-tab-item id="生活">
        <img slot="icon" src="../../../static/images/sport.png">生活
      </mt-tab-item>
      <mt-tab-item id="合作">
        <img slot="icon" src="../../../static/images/friend.png">合作
      </mt-tab-item>
      <mt-tab-item id="关于">
        <img slot="icon" src="../../../static/images/about.png">关于
      </mt-tab-item>
    </mt-tabbar> 
  </div> -->
    <app-footer></app-footer>
  </div>
</template>

<script>
 import appHeader  from './Header.vue';
 import appFooter  from './Footer.vue';
 import appAbout  from '../page/About.vue';
 import appHome  from '../page/Home.vue';
 import appFriend  from '../page/Friend.vue';
 import appSport  from '../page/sport.vue';
 import appTel from '../page/Tel.vue';
 import store from '@/vuex/store'
export default {
  data () {
    return {
      msg: 'Index', 
      // selected: '业务'  
    }
  },
  components:{
     appHeader,appFooter,appAbout,appHome,appFriend,appSport,appTel
  },
  store
   
}
</script>
<style scoped>
  .content{
    position: absolute;
    top:40px;
    left: 0px;
    /* border: 1px solid red; */
    width: 100%;
    height:100%;
  }
  .clear{
    height: 100px;
    width: 100%;
    /* border: 1px solid red; */
  }
</style>
